<template>
	<view class="all col-center-horizotal">
		<image class="avatar" src="/static/images/my.png">

		</image>
		<view class="name">
			{{phone}}
		</view>
		<view class="item row-between-center" style="margin-top: 100rpx;" @click="goModify">
			<view class="tip">
				修改密码
			</view>
			<image src="/static/images/arrow2.png" class="arrow"></image>
		</view>
		<view class="item row-between-center" style="margin-top: 40rpx;" @click="logout">
			<view class="tip">
				退出登录
			</view>
			<image src="/static/images/arrow2.png" class="arrow"></image>
		</view>
		<TabBar ref="mySon" :currentItem2="2"></TabBar>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				phone:''
			}
		},
		onLoad() {
			this.phone = uni.getStorageSync('phone')
		
		},
		onShow() {
		},
		methods: {
			goModify(){
				uni.navigateTo({
					url:'/src/pages/other/modify'
				})
			},
			logout(){
				uni.clearStorageSync()
				uni.redirectTo({
					url:'/src/pages/other/login'
				})
			}
		}
	}
</script>
<style>
	page {
		background: #FCE5E5;
	}
</style>
<style lang="scss" scoped>
	.all {
		padding: 20rpx;
	}

	.avatar {
		margin-top: 60rpx;
		width: 160rpx;
		height: 160rpx;
		border-radius: 50%;
		border: 1rpx solid white;
		background-color: red;
	}

	.name {
		margin-top: 20rpx;
		font-weight: 400;
		font-size: 32rpx;
		color: #4D290B;
		line-height: 48rpx;
	}

	.item {
		padding: 0 20rpx;
		width: 100%;
		height: 108rpx;
		background: #FFEFF3;
		box-shadow: 0rpx 8rpx 24rpx 0rpx rgba(255, 69, 116, 0.2);
		border-radius: 16rpx;
		border: 2rpx solid #FDA2BC;
	}

	.tip {
		font-weight: 400;
		font-size: 32rpx;
		color: #4D290B;
		line-height: 48rpx;
	}

	.arrow {
		width: 20rpx;
		height: 20rpx;
	}
</style>